<template>
  <el-dialog
    append-to-body
    :title="title"
    :visible.sync="dialogVisible"
    width="800px"
  >
    <div>
      <div class="tip">
        灌溉模式：
        <el-radio-group v-model="irrType">
          <el-radio-button
            v-for="(item, index) in irrTypes"
            :key="index"
            :label="item.value"
          >
            {{ item.label }}
          </el-radio-button>
        </el-radio-group>
      </div>
      <div
        class="font-bold font24 text-align-center"
        style="height: 480px; line-height: 480px"
      >
        设备控制面板
      </div>
    </div>
  </el-dialog>
</template>

<script>
  import { convertArr2Obj } from '@/utils'
  export default {
    data() {
      return {
        form: {},
        title: '设备控制',
        irrType: 1,
        dialogVisible: false,
        irrTypes: [
          { label: '均一灌溉', value: 1 },
          { label: '手动变量灌溉', value: 2 },
          { label: '自动变量灌溉', value: 3 },
        ],
      }
    },
    watch: {
      irrType: {
        handler(newVal, oldVal) {
          if (newVal && oldVal) {
            const irrTypesObj = convertArr2Obj(this.irrTypes, 'value')
            this.$baseMessage(
              '设置当前模式为：' + irrTypesObj[newVal]['label'],
              'success',
              'vab-hey-message-success'
            )
          }
        },
        immediate: true,
      },
    },
    methods: {
      show(row) {
        this.form = row
        this.title = row.name + '控制'
        this.dialogVisible = true
      },
    },
  }
</script>

<style lang="scss" scoped></style>
